<style scoped>
  .row_style{
    margin-bottom: 12px;
  }
  .gs_content{
    margin-top: 30px;
  }
  .input_size{
    width:200px;
  }
  .style_inline{
    display: inline-block;
  }
  .input_companyName{
    margin-right: 0px;
  }
  .input_credit_code{
    padding-right: 44px;
  }
  #table_gs{
    width: 100%;
    height: 100%;
  }
</style>
<template>
  <div class="gs_content">
    <div class="row_style">
      <Row>
        <Col span="12">
            <Row>
              <Col span="4">公司名称:</Col>
              <Col span="10"><Input class="input_size company_name" v-model="companyName" placeholder="公司名称"></Input>*</Col>
              <Col span="4">
                <Upload class='style_inline' action="//jsonplaceholder.typicode.com/posts/">
                  <Button type="ghost" icon="ios-cloud-upload-outline">上传文件</Button>
                </Upload>
              </Col>
            </Row>
        </Col>
        <!--<Col span="12">

        </Col>-->
        <!--<Col span="12">
          <div class="input_cell input_companyName">
            公司名称:<Input class="input_size company_name" v-model="companyName" placeholder="公司名称"></Input>*
            <Upload :show-upload-list='false' class='style_inline' action="//jsonplaceholder.typicode.com/posts/">
              <Button type="ghost" icon="ios-cloud-upload-outline">上传文件</Button>
            </Upload>
          </div>
        </Col>-->
        <Col span="12"><div class="input_cell">成立时间:<Date-picker class="input_size" type="date" placeholder="选择日期"></Date-picker>*</div></Col>
      </Row>
    </div>
    <!--<div class="row_style">
      <Row>
        <Col span="12"><div class="input_cell input_credit_code">统一社会信用代码:<Input class="input_size" v-model="companyName" placeholder="公司名称"></Input>*</div></Col>
        <Col span="12"><div class="input_cell">注册地址:<Cascader class="input_size style_inline" :data="data" v-model="value2"></Cascader>*</div></Col>
      </Row>
    </div>
    <div class="row_style">
      <Row>
        <Col span="12">
        <div class="input_cell">
          内 外 资 :
          <Select class="input_size" v-model="model1">
            <Option v-for="item in capitalType" :value="item.value" :key="item.value">{{ item.label }}</Option>
          </Select>
        </div>
        </Col>
        <Col span="12">
        <div class="input_cell">
          经营范围:<Input class="input_size" v-model="companyName" placeholder="经营范围"></Input>*
        </div>
        </Col>
      </Row>
    </div>
    <div class="row_style">
      <Row>
        <Col span="12">
        <div class="input_cell">
          企业性质:
          <Select class="input_size" v-model="model_companyNature">
            <Option v-for="item in companyNature" :value="item.value" :key="item.value">{{ item.label }}</Option>
          </Select>
        </div>
        </Col>
        <Col span="12">
        <div class="input_cell">注册资本:<Input class="input_size" v-model="companyName" placeholder="公司名称"></Input>*</div>
        </Col>
      </Row>
    </div>
    <div class="row_style">
      <Row>
        <Col span="14">
        <div class="input_cell">
          法定代表人:
          <Input class="input_size" v-model="companyName" placeholder="身份证件号"></Input>*
          <Upload :show-upload-list='false'  class='style_inline' action="//jsonplaceholder.typicode.com/posts/">
            <Button type="ghost" icon="ios-cloud-upload-outline">上传文件</Button>
          </Upload>
        </div>
        </Col>
        <Col></Col>
      </Row>
    </div>
    <div class="row_style">
      <Row>
        <Col span="12"><div class="input_cell">基本户银行:<Input class="input_size" v-model="companyName" placeholder="银行名称"></Input>*</div></Col>
        <Col span="12"><div class="input_cell">基本户账号:<Input class="input_size" v-model="companyName" placeholder="银行行号"></Input>*</div></Col>
      </Row>
    </div>-->
  </div>
</template>
<script>
  export default {
    components: {

    },
    data(){
      return{
        tab0:true,
        tab1:false,
        tab2:true,
        companyName:'',
        value2: ['sichuan', 'chengdu', 'gaoxin'],
        data: [{
          value: 'beijing',
          label: '北京',
          children: [
            {
              value: 'gugong',
              label: '故宫'
            },
            {
              value: 'tiantan',
              label: '天坛'
            },
            {
              value: 'wangfujing',
              label: '王府井'
            }
          ]
        }, {
          value: 'sichuan',
          label: '四川',
          children: [
            {
              value: 'chengdu',
              label: '成都',
              children: [
                {
                  value: 'gaoxin',
                  label: '高新区',
                }
              ]
            },
            {
              value: 'nanchong',
              label: '南充',
              children: [
                {
                  value: 'xihuashida',
                  label: '西华师大',
                },
                {
                  value: 'huafeng',
                  label: '华凤',
                }
              ]
            }
          ],
        }],
        capitalType: [
          {
            value: 'neizi',
            label: '内资'
          },
          {
            value: 'waizi',
            label: '外资'
          },
          {
            value: 'guoqi',
            label: '国企'
          }
        ],
        model1: '',
        companyNature: [
          {
            value: 'gongsi',
            label: '公司'
          },
          {
            value: 'geti',
            label: '个体'
          },
          {
            value: 'minbanfei',
            label: '民办非'
          }
        ],
        model_companyNature: '',
        columns7: [
          {
            title: '姓名',
            key: 'name',
            render: (h, params) => {
              return h('div', [
                h('Icon', {
                  props: {
                    type: 'person'
                  }
                }),
                h('strong', params.row.name)
              ]);
            }
          },
          {
            title: '年龄',
            key: 'age'
          },
          {
            title: '地址',
            key: 'address'
          },
          {
            title: '操作',
            key: 'action',
            width: 150,
            align: 'center',
            render: (h, params) => {
              return h('div', [
                h('Button', {
                  props: {
                    type: 'primary',
                    size: 'small'
                  },
                  style: {
                    marginRight: '5px'
                  },
                  on: {
                    click: () => {
                      this.show(params.index)
                    }
                  }
                }, '查看'),
                h('Button', {
                  props: {
                    type: 'error',
                    size: 'small'
                  },
                  on: {
                    click: () => {
                      this.remove(params.index)
                    }
                  }
                }, '删除')
              ]);
            }
          }
        ],
        data_table: [
          {
            name: '王小明',
            age: 18,
            address: '北京市朝阳区芍药居'
          },
          {
            name: '张小刚',
            age: 25,
            address: '北京市海淀区西二旗'
          },
          {
            name: '李小红',
            age: 30,
            address: '上海市浦东新区世纪大道'
          },
          {
            name: '周小伟',
            age: 26,
            address: '深圳市南山区深南大道'
          }
        ],
        isGudong:false
      }
    },
    methods:{
      handleTabRemove(name){
        this['tab' + name] = false;
      },
      show (index) {
        this.$Modal.info({
          title: '用户信息',
          content: `姓名：${this.data_table[index].name}<br>年龄：${this.data_table[index].age}<br>地址：${this.data_table[index].address}`
        })
      },
      remove (index) {
        this.data_table.splice(index, 1);
      },
      businessCircles () {
        //动态加载工商信息tabs标签
        console.log("nihao");
      },
      /*点击新增股东信息*/
      addGudong(){
        this.isGudong?this.isGudong = false:this.isGudong = true;
        //console.log(this.isGudong);
      }
    }
  }
</script>
